<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<link rel="stylesheet" type="text/css" href="css/element.css" />
		<link rel="stylesheet" type="text/css" href="css/reset.css" />
		<link rel="stylesheet" type="text/css" href="css/letter.css" />
		<link rel="stylesheet" type="text/css" href="css/common.css" />
		<script src="js/jquery-3.5.1.js"></script>
		<script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/element.js" type="text/javascript" charset="utf-8"></script>
		<style type="text/css">
			[v-cloak] {
				display: none;
			}
		</style>
	</head>
	<body>
		<div id="app"  v-cloak>
			<div class="page_root letter_page">
				<el-card class="box-card" shadow="never">
					<div class="title title1">种子质量监督抽查生产商确认函</div>
					<div style="text-align: right;margin-right: 100px">编号：{{form.no}}</div>
					<div style="margin-top: 20px;font-size:18px">
						<div>{{form.producer}}:</div>
						<div class="line1">
							<span>&emsp;&emsp;受</span>
							<span @click="dialog1=true" v-if="index == 0">
								<b>{{form.principal}}</b>
							</span>
							<span v-else>
								<b>{{form.principal}}</b>
							</span>
							<span>委托，我单位在</span>
							<span><b>{{form.companyName}}</b></span>
						</div>
						<div class="line1">处扦取标称你单位生产的种子，请你单位予以确认。</div>
						<div class="line1">&emsp;&emsp;该种子标签标注内容主要如下：</div>
						<div class="content">
							<el-row>
								<el-col :span="8">
									<div>
										<span class="label">&emsp;&emsp;作物种类：</span>
										<span><b><u>{{form.cropType}}</u></b></span>
									</div>
								</el-col>
								<el-col :span="8">
									<div>
										<span class="label">种子类别：</span>
										<span><b><u>{{form.seedType}}</u></b></span>
									</div>
								</el-col>
							</el-row>
							<el-row>
								<el-col :span="8">
									<div>
										<span class="label">&emsp;&emsp;品种名称：</span>
										<span><b><u>{{form.cropName}}</u></b></span>
									</div>
								</el-col>
								<el-col :span="8">
									<div>
										<span class="label">产地：</span>
										<div style="display: inline-block">
											<el-input v-model="form.origin" placeholder="请输入内容" size="small"></el-input>
										</div>
									</div>
								</el-col>
								<el-col :span="8">
									<div>
										<span class="label">批号：</span>
										<div style="display: inline-block">
											<span><b><u>{{form.lotNum}}</u></b></span>
										</div>
									</div>
								</el-col>
							</el-row>
							<el-row>
								<el-col :span="8">
									<div>
										<span class="label">&emsp;&emsp;种子经营许可证编号：</span>
									</div>
								</el-col>
								<el-col :span="10">
									<div style="text-align: center">
										<b><u>{{form.seedNo}}</u></b>
									</div>
								</el-col>
							</el-row>
							<el-row>
								<el-col :span="6">
									<div>
										<span class="label">&emsp;&emsp;质量指标：</span>
									</div>
								</el-col>
								<el-col :span="14">
									<div style="text-align: center">
										<b><u>{{form.qualityIndex}}</u></b>
									</div>
								</el-col>
							</el-row>
							<el-row>
								<el-col :span="8">
									<div>
										<span class="label">&emsp;&emsp;净含量：</span>
										<span><b><u>{{form.packingSize}}</u></b></span>
									</div>
								</el-col>
								<el-col :span="8">
									<div>
										<span class="label">生产年月：</span>
										<span><b><u>{{form.bzDate}}</u></b></span>
									</div>
								</el-col>
							</el-row>
							<el-row>
								<el-col :span="6">
									<div>
										<span class="label">&emsp;&emsp;生产商名称：</span>
									</div>
								</el-col>
								<el-col :span="14">
									<div style="text-align: center">
										<b><u>{{form.producer}}</u></b>
									</div>
								</el-col>
							</el-row>
							<el-row>
								<el-col :span="6">
									<div>
										<span class="label">&emsp;&emsp;生产商地址：</span>
									</div>
								</el-col>
								<el-col :span="14">
									<div style="text-align: center">
										<b><u>{{form.address2}}</u></b>
									</div>
								</el-col>
							</el-row>
							<el-row>
								<el-col :span="6">
									<div>
										<span class="label">&emsp;&emsp;电话及传真：</span>
									</div>
								</el-col>
								<el-col :span="14">
									<div style="text-align: center">
										<b><u>{{form.tel2}}</u></b>
									</div>
								</el-col>
							</el-row>
							<el-row>
								<el-col :span="6">
									<div  @click="dialog2 = true">
										<span class="label">&emsp;&emsp;其他：</span>
									</div>
								</el-col>
								<el-col :span="14">
									<div style="text-align: center;min-height: 20px;"  @click="dialog2 = true">
										<b><u>{{form.other}}</u></b>
									</div>
								</el-col>
							</el-row>
						</div>
						<div @click="dialog3 = true">&emsp;&emsp;对于以上信息，受检单位已在编号为   {{form.sampleNo}}  的扦样单上签字确认，请你单位在接到本函7日内予以回复，
			逾期不回复的，则视为种子是你单位生产的产品。回复地址：{{form.addr}}；联系人：{{form.concats}}；联系电话：{{form.tel}}</div>
						<div style="text-align: center;padding: 10px 0; ">广州市农作物种子质量检验中心（公章）</div>
						<div style="padding: 10px 0;border-bottom: 1px #000 dashed ">
							<span>发送方式：□传真/□邮寄/□其他</span>
							<span style="float: right">&emsp;&emsp;年&emsp;&emsp;月&emsp;&emsp;日</span>
						</div>
						<div class="title title1" style="position: relative">
							<span>确  认  回  执  单</span>
							<span style="position: absolute;right: 20px;font-size: 18px;font-weight: 100;margin-top: 10px">编号：{{form.no}}</span>
						</div>
						<div class="line1">&emsp;&emsp;□是本单位生产的种子（指本单位生产，或分装，或进口）。</div>
						<div class="line1">&emsp;&emsp;□不是本单位生产的种子，我单位将在规定时间寄送证明材料。</div>
						<div style="width: 200px;float: right;text-align: center;margin: 50px 0">
							<div>（公章）</div>
							<div>&emsp;&emsp;年&emsp;&emsp;月&emsp;&emsp;日</div>
						</div>
					</div>

				</el-card>
			</div>
			<el-dialog :visible.sync="dialog1" width="50%">
				<el-select v-model="form.principal" placeholder="请选择" style="width: 300px">
					<el-option v-for="item in principals" :key="item" :label="item" :value="item">
					</el-option>
				</el-select>
			</el-dialog>
			
			<el-dialog  :visible.sync="dialog2" width="50%">
				<el-form :model="form">
					<el-form-item >
						<el-input type='textarea' v-model="form.other" autocomplete="off"></el-input>
					</el-form-item>
				</el-form>
			</el-dialog>
			<el-dialog  :visible.sync="dialog3" width="50%">
                <el-form :model="form" label-width="80px" >
                    <el-form-item label="回复地址">
                        <el-input v-model="form.addr" ></el-input>
                    </el-form-item>
                    <el-form-item label="联系人">
                        <el-select v-model="form.concats" placeholder="请选择" style="width: 100%">
                            <el-option v-for="item in employee" :key="item"  :label="item" :value="item"></el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="电话">
                        <el-input v-model="form.tel" ></el-input>
                    </el-form-item>
                </el-form>
			</el-dialog>
		</div>

		<script>
			new Vue({
				el: '#app',
				data: {
					/** 基础参数 ***/
					/*****/
					authors:[
							'肖婉玉','张三'
					],
					principals:['广东省农业农村厅','广州市农业环境与植物保护总站','广州市农业农村局'],
					dialog1:false,
					dialog2:false,
                    dialog3:false,
					form: {
						companyName: '阿达',
						producer: 'asd',
						cropType: '水稻',
						cropName: '水稻',
						bzDate: '2021-09-10',
						lotNum: '120589623as',
						qualityIndex:'净度≥98%，发芽率≥98%，纯度≥98%，水分≥98%',
						no:'',
						principal:'广州市农业农村局',
						seedNo:'sdsdsdsd',
						seedType:'sdsdsdsd',
						origin:'asdasdasd',
						packingSize:'123',
						address2:'asd',
						tel2:'234',
						other:' ',
						sampleNo:'GB123',
						addr:'',
                        concats:'',
                        tel:''
					}
				},
				watch: {
					// form监听
				    form: {
				         handler: function(val) {
				             console.log(val)
                             window.cache.letterArr.forEach(item => {
                                 item.principal = val.principal
                                 item.addr = val.addr
                                 item.concats = val.concats
                                 item.tel = val.tel
                             })
				        },
				        deep: true
				    }
				} ,
				created() {
					window.cache = window.parent.cache;
					this.employee = window.cache.employee
					var href = location.href
					this.index = href.substring(href.lastIndexOf("=")+1) - 1
					this.getData(this.index)
				},
				methods: {
					getData(){
						var obj = window.cache.getItemData(this.index,'letter')
						// var xcjl = window.cache.xcjl
						// obj.seedNo = xcjl.descList[8][this.index+1]
                        // if(this.index != 0){
                        //     var first = window.cache.getItemData(0,'letter')
						// 	obj.principal = first.principal
						// }
						this.form = obj
					}
				}
			})
		</script>
	</body>
</html>
